DESIGN SOFTWARE - HTML Tables

TABLES allow you to create and organize rows and columns of information for nice, neat formatting.

A Basic Table would look like this:

<TABLE>
<TR>
<TD> This is cell#1 </TD>
<TD> This is cell#2 </TD>
</TR>
</TABLE>

There are only THREE tags you need to memorize to make tables, but the ORDER that you put them in is crucial:

TAG	What it does	Working Parameters
<TABLE>	Starts a TABLE	BORDER BGCOLOR CELLPADDING BORDERCOLOR WIDTH HEIGHT
<TR>	Starts a table ROW	BGCOLOR BORDERCOLOR HEIGHT ALIGN = LEFT, CENTER, RIGHT VALIGN = TOP, MIDDLE, BOTTOM
<TD>	Starts a table DATA cell	BGCOLOR BORDERCOLOR HEIGHT WIDTH ALIGN = LEFT, CENTER, RIGHT VALIGN = TOP, MIDDLE, BOTTOM

edit

Art Gallery Challenge

PHASE 1:
Create a table on your "Pictures" page that will allow you to neatly present your "artwork" along with titles, descriptions and comments about those pieces.

Think of each cell as being a small "mini-webpage" that can have it's own titles, <BR> tags and formatting.

PHASE 2:
To make the gallery look REALLY good - Use Photoshop to RESIZE your graphics as "thumbnails" so they are all about 150 pixels wide. That will leave ample room for descriptions.

PHASE 3:
It would be nice if when you clicked one of the thumbnails, it would load up a FILL SIZED version of image within the website.

1. You can do this by making a FULLSIZED version of each image

Find the original artwork for each image
Resize it to a maximum height of 500 pixels, or a maximum width of 900 pixels - whichever comes first
SAVE that new image with a name that resembles the thumbnail filename - ie
- "HappyFace_big.jpg" and "HappyFace.jpg" or
- "StormLogo.jpg" and "StormLogo_tn.jpg"

2. Turn the first thumbnail into a LINK. Have the first one link to a new page called "picture01.htm"

Save your "pictures.htm" page

3. Now create the "picture01.htm" page EASILY by simply using SAVE AS and renaming the pictures.htm page.

4. Edit the table to remove unwanted rows, replace

HTML_tables

DESIGN SOFTWARE - HTML Tables